<template>
  <w-table-view
    :types="types"
    :list-data="listData"
    icon-name="cover"
    title-name="name"
    describe-name="startDate"
    describe1-name="endDate"
    detail-name="describe"
    class="w-nav-height"
    detail-path="/web/product"
  />
</template>

<script>
import WTableView from '@/components/global/tableview/searchBar'
import { Api } from '@/config/api'
export default {
  layout: 'web',
  name: 'WebProduct',
  components: {
    WTableView
  },
  fetch ({ store }) {
    store.commit('app/SET_NAV_INDEX', '/web/product')
  },
  async asyncData ({ app, route }) {
    const { $wAxios } = app
    const data = await Promise.all([
      $wAxios.$get(Api.product.types),
      $wAxios.$get(Api.product.list, route.query)
    ])
    return { types: data[0], listData: data[1] }
  },
  data () {
    return {}
  },
  watch: {
    async '$route.query' (query) {
      this.listData = await this.$wAxios.$get(Api.product.list, query)
    }
  },
  head () {
    return {
      title: '烽火雪月的东西'
    }
  }
}
</script>

<style scoped lang="less"></style>
